<?php /*a:3:{s:75:"D:\phpstudy_pro\WWW\oldi-erp\app\admin\view\purchase\procurement_itmes.html";i:1745992107;s:62:"D:\phpstudy_pro\WWW\oldi-erp\app\admin\view\public\header.html";i:1743495714;s:61:"D:\phpstudy_pro\WWW\oldi-erp\app\admin\view\public\style.html";i:1743495714;}*/ ?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ERP</title>

    <link rel="stylesheet" href="/static/css/element-ui@2.15.14.css">
    <script src="/static/js/vue.js"></script>
    <script src="/static/js/element-ui@2.15.14.js"></script>
    <script src="/static/js/axios.js"></script>
    <script src="/static/js/qs.js"></script>
    <script src="/static/js/config.js"></script>
    <script src="/static/js/echart.js"></script>


<style scoped>
    .el-select-dropdown {
      padding: 0;
    }
    </style>
 
<style>
    html,
    body,
    #app {
        padding: 0;
        margin: 0;
    }    
    #contenr{
        padding: 0;
        margin: 10px;
    }
</style>

<body>
    <div id="app"  v-cloak>
        <div id="contenr">
        <el-card  >   
            <el-breadcrumb separator="/">
                <el-breadcrumb separator="/">
                    <el-page-header @back="goBack"  content="待采购列表"></el-page-header>
                </el-breadcrumb>        
            </el-breadcrumb>
        </el-card>
        <br>      
      
          <el-card  >   
            <div style="display: flex;align-items: center;justify-content: flex-start;">
                <el-form :inline="true" :model="searchForm" size="small"  ref="refsearchForm">    
                    <el-form-item label="本地localsku">
                        <el-input v-model="createForm.localsku" placeholder="请输入本地localsku"  clearable></el-input>
                    </el-form-item>     
                    <el-form-item label="采购员">
                        <el-select v-model="searchForm.buyer_id" placeholder="请选择采购员" filterable clearable>
                            <el-option v-for="item in user_list" :key="item.id" :label="item.nickname" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>      
                    <el-form-item>                         
                        <el-button type="primary"  size="small" plain @click="getSearch" icon="el-icon-search" v-cloak>查询</el-button>
                        <el-button type="primary"  size="small"  @click="checkSubmits" icon="el-icon-edit-outline" v-cloak>批量生成采购单</el-button>
                        <el-button type="danger"  size="small"  @click="batchcancel" icon="el-icon-delete" v-cloak>批量取消采购单</el-button>
                    </el-form-item>          
                  </el-form>    
            </div>  

            <el-table :data="tablelist"   style="width: 100%;margin-bottom: 20px;" @selection-change="handleSelectionChange"   row-key="id"  border >       
                <el-table-column   type="selection" width="55"></el-table-column>       
                <el-table-column   prop="localsku" label="本地localsku" > </el-table-column>
                <el-table-column   prop="supplier_name" label="供应商" > </el-table-column>  
                <el-table-column   prop="count" label="采购的数量" >
                    <template v-slot="{row,$index}">
                        <div class="edit-wrapper">
                            <span>{{row.count}}</span>
                            <el-popover placement="bottom-start" width="220" trigger="click" :model="visible1" @show="iconShow(row)" title="撤销入库数量">
                            
                                <div style="border-bottom: 1px solid #DCDFE6;"></div>
                                <div style="font-size: 12px;color: #999999;font-weight: 400;margin-top: 10px;">{{row.localsku}}</div>
                                <div style="display:flex;align-items: center;margin-top: 5px;font-size: 12px;color: #999999;font-weight: 500;">
                                    <div style="flex-shrink: 0;">采购单价:{{row.actualPrice}}</div> 
                                </div>                    

                                <div style="display:flex;align-items: center;margin-top: 5px;font-size: 12px;color: #999999;font-weight: 500;">
                                    <div style="flex-shrink: 0;">采购的数量:{{row.count}}</div> 
                                </div>                    

                                <div style="display:flex;align-items: center;margin-top: 5px;font-size: 12px;color: #999999;font-weight: 500;">
                                    <div style="flex-shrink: 0;">采购总金额:{{row.totalPrice}}</div> 
                                </div>                    

                                <div style="display:flex;align-items: center;margin-top: 5px;font-size: 12px;font-weight: 500;">
                                    <div style="flex-shrink: 0;">修改后的采购的数量：</div> 
                                    <el-input onkeyup="value=(value.replace(/\D/g,'')==''?'':parseInt(value))" size="mini" v-model="row.num" placeholder="请输入采购的数量"></el-input>
                                </div> 
                                <el-button style="margin-left:120px;margin-top: 10px;" type="text" size="mini" @click="iconHidden(row)">取消</el-button>
                                <el-button  size="mini"  type="primary" @click="saveNumvisible(row)">保存</el-button>
                                
                                <i slot="reference"  class="el-icon-edit popover-icon" :class="['icon-in_num-' + $index]" ></i>
                            </el-popover>  
                        </div>
                    </template>
                </el-table-column> 
                <el-table-column   prop="totalPrice" label="采购总金额" ></el-table-column> 
                <el-table-column   prop="actualPrice" label="采购价格" ></el-table-column> 
                <el-table-column   prop="storage_name" label="所属仓库" ></el-table-column> 
                <el-table-column   prop="buyer_name" label="采购员" ></el-table-column>   
                <el-table-column  fixed="right" label="操作" width="120">
                    <template v-slot="{row}">      
                        <el-button type="danger"  plain  icon="el-icon-delete"  @click="cancel(row)" >取消 </el-button>                     
                    </template>
                </el-table-column>
            </el-table>    
            <!-- page -->
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="searchForm.pagenum" :page-sizes="[20,50,100, 150, 300,500,1000,2000]"
                :page-size="searchForm.pagesize" layout="total, sizes, prev, pager, next, jumper" :total="total">
            </el-pagination>  
        </el-card>        
         
        </el-card>
    </div>      


    <script>
        new Vue({
            el: '#app',
            data: function () {
                return { 
                    supplier_list:<?php echo $supplier_list; ?>,
                    user_list:<?php echo $user_list; ?>,
                    total:0,   //分页总页数      
                    tablelist:[] ,              
                    searchForm:{
                        id: <?php echo htmlentities($id); ?>,                         
                        localsku:'',
                        buyer_id:'',
                        pagesize: 20,
                        pagenum: 1,
                           
                    },
                    visible1: true,
                    id: <?php echo htmlentities($id); ?> ,     
                    createForm:{
                        selectids:'',
                        type:'2'
                   },
                   cancelForm:{
                        selectids:'',
                        type:'2'
                   },
                   saveForm:{
                        id:'',
                        count:'',
                        actualPrice:""
                   },
                 }                   
                   
                
            },
            mounted(){   
                this.getSearch()                   
            },
            methods: {        
                  //返回上一个页面
                goBack() {              
                    window.location.href = '/Admin/purchase/procurement';
                },            
                
                 async getlist() {
                    let loading = this.$loading({
                          lock: true,
                          text: '数据加载中···',
                          spinner: 'el-icon-loading',
                          background: 'rgba(0, 0, 0, 0.7)'
                    });
                    const res = await axios.post('/Admin/purchase/procurement_itmes', {params: this.searchForm})
                    loading.close()
                    if (res.status !== 1) {
                        return this.$message.error(res.info);
                    }     
                    this.tablelist = res.info.list
                    this.total = res.info.total
                 },
                 getSearch() {
                    this.searchForm.pagenum = 1
                    this.getlist()
                },  
                  // 获取多选值
                  handleSelectionChange(res)
                {
                console.log(res);
                    var ids  = '';
                    res.forEach(item => {                      
                        ids += item.id+',';
                    })
                   this.cancelForm.selectids = ids.substring(0,ids.length-1);
                    this.createForm.selectids = ids.substring(0,ids.length-1);
                    console.log(this.createForm.selectids);
                },
              
                //确认提交修改
                async checkSubmits(){
                  this.$refs.refcreateForm.validate(async valid => {                 
                      if (!valid) return;
                      let loading = this.$loading({
                          lock: true,
                          text: '数据保存中···',
                          spinner: 'el-icon-loading',
                          background: 'rgba(0, 0, 0, 0.7)'
                            });
           
                      axios.post('/Admin/user/create_purview', {params: this.createForm}).then(res => {
                          loading.close()
                          if (res.status !== 1) {
                              return this.$message.error(res.info);                  
                          }
                      
                          this.$message.success('操作成功');
                          window.location.href = '/Admin/user/index';                      
                      }).catch(err => {
                          console.log(err)
                      })
                  })
                },
                handleSizeChange(newSize) {
                    this.searchForm.pagesize = newSize
                    this.getDatalist()
                },
                handleCurrentChange(newPage) {
                    this.searchForm.pagenum = newPage
                    this.getDatalist()
                }, 
                 //批量取消采购单
                 async batchcancel(){
                    if (this.cancelForm.selectids.length == 0 ){
                        return this.$message.error('请选择生成的供应商!');
                    } 
                    this.$confirm('确定要取消所选采购单吗？', '提示', {
                        confirmButtonText: '确定取消',
                        cancelButtonText: '取消取消',
                        closeOnClickModal: false, // 禁用点击遮罩关闭弹窗
                        type: 'warning'
                    }).then(() => {
                        let loading = this.$loading({
                            lock: true,
                            text: '取消采购单中···',
                            spinner: 'el-icon-loading',
                            background: 'rgba(0, 0, 0, 0.7)'
                        });
                        axios.post('/Admin/purchase/cancel_purchase_itmes', {params: this.cancelForm}).then(res => {
                            loading.close()
                            if (res.status !== 1) {
                                return this.$message.error(res.info);             
                            }                    
                            this.$message.success('取消成功');
                            this.getlist()
                        }).catch(err => {
                            console.log(err)
                        })   
                        
                    }).catch(() => {
                        this.getlist()
                        this.$message.info('已取消修改');
                    });
                },
                //取消采购单
                async cancel(row){
                    this.cancelForm.selectids = row.s_id;
                    this.$confirm('确定要取消所选采购单吗？', '提示', {
                        confirmButtonText: '确定取消',
                        cancelButtonText: '取消取消',
                        closeOnClickModal: false, // 禁用点击遮罩关闭弹窗
                        type: 'warning'
                    }).then(() => {
                        let loading = this.$loading({
                            lock: true,
                            text: '取消采购单中···',
                            spinner: 'el-icon-loading',
                            background: 'rgba(0, 0, 0, 0.7)'
                        });
                        axios.post('/Admin/purchase/cancel_purchase_itmes', {params: this.cancelForm}).then(res => {
                            loading.close()
                            if (res.status !== 1) {
                                return this.$message.error(res.info);             
                            }                    
                            this.$message.success('取消成功');
                            this.getlist()
                        }).catch(err => {
                            console.log(err)
                        })   
                        
                    }).catch(() => {
                        this.getlist()
                        this.$message.info('已取消修改');
                    });
                },

                iconShow(row){
                 console.log(row)
                 this.visible1 = true;      

               }, 
                iconHidden(row){
                 this.visible1 = false;
                },

                saveNumvisible(row) {   
                    this.saveForm.actualPrice=row.actualPrice         
                    this.saveForm.id=row.id;
                    this.saveForm.count=row.num    
                    let loading = this.$loading({
                        lock: true,
                        text: '修改采购数量中···',
                        spinner: 'el-icon-loading',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    axios.post('/Admin/purchase/purchase_save_num', {params: this.saveForm}).then(res => {
                        loading.close()
                        if (res.status !== 1) {
                            return this.$message.error(res.info);             
                        }                    
                        this.$message.success('修改成功');
                        this.visible1 = false;
                        this.getlist()
                    }).catch(err => {
                          console.log(err)
                    })                    
                },               
               
            }
        })
     </script>
</body>    
 </html>
      